﻿.hover-circle {
  
    position: relative;
}
 
.hover-circle, .hover-circle img {
    width: 200px;
    height: 200px;
    
}
 
.hover-circle img {
    position: absolute;
    width: 100%;
    height: 100%;
    left:0px;
}
 

.info p {
   font-family:Agency FB;
 
    margin: 0px 5px 0px 5px;
    font-size:25px;
    font-weight:bold;
    letter-spacing: inherit;
      color:Black;
     text-align:center;
}

.effect1 .overlay {
    background-color: rgba(120, 55, 18, 0.102);
  
    box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600), 0px 0px 0px 0px rgba(192, 61, 32, 0.806) inset;
    -webkit-box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600), 0px 0px 0px 0px rgba(192, 61, 32, 0.806) inset;
    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.effect1 .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
 
}




.effect1:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
}
 
.effect1:hover .overlay {
    box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600), 0px 0px 0px 125px rgba(192, 61, 32, 0.506) inset;
}


/*000000000000000000000000000000000000000000000*/
.effect2 .overlay {
    background-color: rgba(120, 55, 18, 0.102);
 
    box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    -webkit-box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
    color: #fff;
}
 
.effect2 .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.2s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.2s linear;
    background-color: rgba(0, 0, 0, 0.800);
    
}

.effect2:hover .overlay .info {
    transform: scale(1);
    -webkit-transform: scale(1);
}
 
.effect2:hover .overlay {
    box-shadow: 0px 0px 0px 0px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    -webkit-box-shadow: 0px 0px 0px 0px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
}
/*0000000000000000000000000000000000*/

.effect3 .overlay {
    background-color: rgba(120, 55, 18, 0.102);
 
    box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    -webkit-box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    position: absolute;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
    color: #fff;
}
 
.effect3 .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    opacity: 0;
    background-color:Blue;
   
}
 
.effect3:hover .overlay .info {
    opacity: 1;
}
 
.effect3:hover .overlay {
    box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
    -webkit-box-shadow: 0px 0px 0px 20px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
  
}

/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.header_bottom_left_groupTop_IMG {
    width:40%;
    height: 100%;
    float:left;
    background-color:#EEEE00;
    position: relative;
}
 


 



.aaa .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/home.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.aaa .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.aaa:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
      
}
 .aaa:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}

/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/
.bbb .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/Product.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.bbb .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.bbb:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .bbb:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}

/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.ccc .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/Order.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.ccc .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.ccc:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .ccc:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}

/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.ddd .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/News.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.ddd .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.ddd:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .ddd:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}
/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.eee .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/About.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.eee .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.eee:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .eee:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}
/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.fff .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/Contact.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.fff .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.fff:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .fff:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}
/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/


.ggg .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/branch.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.ggg .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.ggg:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .ggg:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}
/*ooooooooooooooooooooooooooooooo00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000ooooooooooooooooooooooo*/

.hhh .overlay {
    background-color: rgba(120, 55, 18, 0.102);
    background-image:url(../images/logo/Customer.jpg);

    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
  
}
 
.hhh .overlay .info {
    font-family: "Tahoma";
    width: 100%;
    height: 100%;
    display: block;
    transform: scale(0);
    transition: all 0.3s linear;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.3s linear;
}
.hhh:hover .overlay .info {
    transform: scale(1);
      -webkit-transform: scale(1);
      cursor: pointer;
}
 .hhh:hover .overlay {
    box-shadow: 0px 0px 3px #EE7600, 0px 0px 0px 125px #EE7600 inset;
}

/*ooowwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww*/

.aa1 .overlay {
  
   
 
    position: absolute;
    transition: box-shadow 0.3s linear;
    -webkit-transition: box-shadow 0.3s linear;
    width: 100%;
    height: 100%;
    z-index: 1;
    color: #fff;
}
 
.aa1 .overlay .info {
font-family: "Tahoma";
width: 100%;
height: 100%;
display: block;
transform: scale(0);
transition: all 0.2s linear;
-webkit-transform: scale(0);
-webkit-transition: all 0.2s linear;
background-color: #EE7600;
margin-top: -18px;
}

.aa1:hover .overlay .info {
    transform: scale(1);
    -webkit-transform: scale(1);
   
}
 
.aa1:hover .overlay {
    box-shadow: 0px 0px 0px 0px rgba(242, 242, 242, 0.196) inset, 0px 0px 3px rgba(100, 100, 100, 0.600);
  
}